<!DOCTYPE html>
<html>
<head>
    <title>My Application</title>
    <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlx.css">
    <script src="codebase/dhtmlx.js" type="text/javascript"></script>
	<style>
		html, body {
			width: 100%;
			height: 100%;
			margin: 0px;
			padding: 0px;
			overflow: hidden;
		}
	</style>
	
    <script>
		var docLayout;
        function buildInterface(){
            docLayout = new dhtmlXLayoutObject(document.body, "2U");
			docLayout.attachHeader("header");
			docLayout.attachFooter("footer");
			docLayout.cells('a').setText("功能菜单");
			docLayout.cells('a').setWidth(200);
			loadTree();
			docLayout.cells('b').setText("目录");
        }
		
		function loadTree() {
			funcTree = docLayout.cells("a").attachTree();
			funcTree.setImagePath('codebase/imgs/');
			dhtmlxAjax.get("tree.xml",function(loader){
				funcTree.loadXMLString(loader.xmlDoc.responseText);
			});
			funcTree.attachEvent("onClick", function(id){
				var url = funcTree.getUserData(id,"url");
				if (url) docLayout.cells("b").attachURL(url + "?t=" + new Date().getTime());
				return true;
			});
		}
	
        dhtmlxEvent(window,"load", buildInterface);
    </script>
</head>
<body>
	<div id="header" style="height: 40px;">header!</div>
	<div id="footer" style="height: 20px;">copyright!</div>
</body>
</html>